@import "../../assets/styles/variables.less";
.tag-pane {
  height: 30vh;
  background: #fff;
  border-radius: 8rpx;
  .title {
    position: relative;
    height: 6vh;
    line-height: 6vh;
    background: #DFEDFF;
    padding-left: 37rpx;
    margin-top: 4vh;
    image {
      width: 338rpx;
      height: 188rpx;
      position: absolute;
      right: 0;
      top: -65rpx;
    }
  }
  .tag {
    display: flex;
    padding: 3vh 0;
    align-items: center;
    .type-list {
      width: 300rpx;
      height: 18vh;
      color: @blue-font;
      font-size: 38rpx;
      // background-image: linear-gradient(#FFFFFF, #0067E6, #FFFFFF);
      .type {
        height: 6vh;
        line-height: 6vh;
        -webkit-background-clip: text;
        // -webkit-text-fill-color: transparent;
      }
      &::after {
        height: 100%;
        width: 1rpx;
        position: absolute;
        right: 0;
      }
    }
    .type-wrap {
      position: relative;
      text-align: center;
      .iconfont {
        position: absolute;
        color: #0067E6;
      }
      .icon-zhankai {
        top: -3vh;
      }
      .icon-shouqi {
        bottom: -3vh;
      }
    }
    .tag-list {
      width: 360rpx;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      flex-wrap: wrap;
      font-size: 30rpx;
      height: 18vh;
      .tag-item {
        margin-right: 20rpx;
      }
    }
  }
}
.label-analysis-mask {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  .close{
    position: absolute;
    top:255rpx;
    width: 40rpx;
    right: 100rpx;
    z-index: 1;
    height: 156rpx;
    background: url("https://ailearning.zhilingsd.com/h5/static/img/label-analysis-close.png");
    background-repeat: no-repeat;
    background-size: 100%  100%;
  }
  .title{
    position: absolute;
    top:372rpx;
    width: 550rpx;
    right: 100rpx;
    font-size: 30rpx;
    text-align: center;
    z-index: 1;
    height: 60rpx;
    color:#fff;
    line-height: 60rpx;   
    text-shadow: 0px 2px 4px rgba(35, 123, 255, 0.58);
  }
  .desc{
    position: absolute;
    top:466rpx;
    width: 480rpx;
    left: 135rpx;
    font-size: 52rpx;
    text-align: center;
    display: flex;
    height: 240rpx;
    align-items: center;
    justify-content: center;
    z-index: 1;
    color:#fff;
    text-shadow: 0px 4px 2px #05336A;
  }
  .label-analysis{
    position: absolute;
    top:160rpx;
    width: 550rpx;
    left: 100rpx;
    height: 720rpx;
    background: url("https://ailearning.zhilingsd.com/h5/static/img/label-analysis.png");
    background-repeat: no-repeat;
    background-size: 100%  100%;
  }
  .count-down{
    position: absolute;
    top: 922rpx;
    width: 130rpx;
    height: 65rpx;
    line-height: 65rpx;
    text-align:center;
    left: 50%;
    margin-left: -65rpx;
    color:#fff;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 49rpx;
  }
}
.moving-tag {
  position: absolute;
  .tag-item {
    display: inline-block;
    opacity: 0.7;
  }
}
.normal-btn {
  margin-top: 3vh;
}